<!--
 * @Author: libing 9852442+liu-sheng-8667@user.noreply.gitee.com
 * @Date: 2024-04-12 22:55:14
 * @LastEditors: xuezhuangzhuang xzz6996@qq.com
 * @LastEditTime: 2025-06-30 22:57:05
 * @FilePath: \crm\pages\customer\photo-order.vue
 * @Description: 拍照下单
-->
<template>
  <view class="photo-order">
    <u-navbar title="拍照订单" :autoBack="true" bgColor="transparent">
      <!-- <template #right>
        <text
          style="font-size: 26rpx; color: #dc2626; margin-right: 200rpx"
          @click="onCreateHandle"
          >新建</text
        >
      </template> -->
    </u-navbar>
    <view class="search-wrap">
    <u-search
      placeholder="请输入手机号"
      v-model="customContactsPhone"
      bgColor="#FFFFFF"
      height="68rpx"
      actionText=" "
      placeholderColor="#C1C5C9"
      :showAction="false"
      @change="upper"
    />
    </view>
    <view class="search-wrap">
      <u-search
        placeholder="请输入客户"
        v-model="custom"
        bgColor="#FFFFFF"
        height="68rpx"
        placeholderColor="#C1C5C9"
        :showAction="false"
        actionText="新建"
        @custom="onCreateHandle"
        @change="upper"
        :actionStyle="actionStyle"
      />
    </view>
    <view class="bg"></view>
    <scroll-view
      scroll-y="true"
      class="scroll-Y"
      @scrolltoupper="upper"
      @scrolltolower="lower"
    >
      <!-- 无限滚动列表 -->
      <view v-for="(item, index) in list" :key="index">
        <PhotoOrderItem :item="item" />
      </view>
      <u-loadmore iconType="circle" :status="status" />
    </scroll-view>
  </view>
</template>
<script>
// import OrderItem from "./conponents/order-item.vue";
import PhotoOrderItem from "./conponents/photo-order-item.vue";
import listPageMixins from "./mixins/scroll-list";
import { getPhotoOrderList } from "@/apis/order/index";
export default {
  name: "my-customer",
  components: {
    PhotoOrderItem,
  },
  mixins: [listPageMixins],
  data() {
    return {
      queryAPI: getPhotoOrderList,
      actionStyle: {
        width: "100rpx",
        color: "#DC2626",
      },
      customContactsPhone: "",
      custom: ""
    };
  },
  onShow() {
    this.upper();
  },
  methods: {
    onCreateHandle() {
      uni.navigateTo({
        url: "/pagesform/form/photo-order-form",
      });
    },
  },
};
</script>
<style scoped lang="scss">
.scroll-Y {
  height: calc(100vh - 300rpx);
}
.photo-order {
  height: 100vh;
  padding: 0 18rpx;
  background: #f2f4f5;

  .bg {
    height: 659rpx;
    background: linear-gradient(#f4eae9 0%, #f4e9e8 10%, #f2f4f5 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
  }
}
.search-wrap {
  margin-bottom: 20rpx;
  position: relative;
  z-index: 100;
  margin-top: 20rpx;
  display: flex;
  flex-wrap: wrap;
}
</style>
